<template>
	<view class="userbox pageBg" >
		<view :style="{height: getBarHeight()+'px'}"></view>
		<view class="userinfo" v-if="userInfo">
			<image src="../../common/images/1.png"></image>
			<text class="text1">{{userInfo.IP}}</text>
			<text class="text2">来自:{{userInfo.address.province}}-{{userInfo.address.city}}</text>
		</view>
		<view class="setion">
			
			     <view class="list"  @click="getDown">
					<view class="list_item"  >
						<uni-icons type="download-filled" size="30" color="#3e9aca" ></uni-icons>
						<text>我的下载</text>
					</view>
					<view  class="list_item">
						<text>{{userInfo.downloadSize}}</text>	
						<uni-icons type="right" size="30" ></uni-icons>
				    </view>
			    </view>
				<view class="list"  @click="getStar">
					<view class="list_item">
						<uni-icons type="download-filled" size="30" color="#3e9aca"></uni-icons>
						<text>我的评分</text>
					</view>
					<view  class="list_item">
						<text>{{userInfo.scoreSize}}</text>	
						<uni-icons type="right" size="30" ></uni-icons>
				    </view>
				</view>
			
		</view>
		<view class="setion">
			
			     <view class="list">
					<view class="list_item">
						<uni-icons type="notification-filled" size="30" color="#3e9aca"></uni-icons>
						<text>订阅更新</text>
					</view>
					<view class="list_item">
						<uni-icons type="right" size="30" ></uni-icons>
				    </view>
			    </view>
				<view class="list">
					<view class="list_item">
						<uni-icons type="info" size="30" color="#3e9aca"></uni-icons>
						<text>常见问题</text>
					</view>
					<view class="list_item">
						<uni-icons type="right" size="30" ></uni-icons>
				    </view>
				</view>
				<view class="list" @click="sedAuthe">
					<view class="list_item" >
						<uni-icons type="email" size="30" color="#3e9aca"></uni-icons>
						<text>联系作者</text>
					</view>
					<view class="list_item">
						<uni-icons type="right" size="30" ></uni-icons>
				    </view>
				</view>
			
		</view>
		<view class="setion">
			 <button>退出登录</button>  
		</view>
		<view class="texts">
			<text> 关于我们 | About our</text>   
			<text> 服务条款 | 广告设置</text>   
			<text> APP招聘 | 客服中心</text> 
		</view>
	</view>
</template>

<script setup>
import { ref } from 'vue';
import {getBarHeight} from '@/utils/system.js'
import {RequestUserInfo} from '@/apis/apis.js'
 // const userone=ref([{ico:'download-filled',va:'我的下载',Down:userInfo.value.downloadSize},{ico:'star-filled',va:'我的收藏',Down:userInfo.value.scoreSize}])
 // const usertwo=ref([{ico:'notification-filled',va:'订阅更新'},{ico:'info',va:'常见问题'},{ico:'email',va:'联系作者'}])
 const userInfo=ref({})
async function getUserInfo (){
	let res =await RequestUserInfo()
	userInfo.value=res.data.data
	console.log(res);
}

function getDown(){
	uni.navigateTo({
		url:'/pages/classifyItem/classifyItem?name=我的下载&type=download'
	})
}
function getStar(){
	uni.navigateTo({
		url:'/pages/classifyItem/classifyItem?name=我的评分&type=score'
	})
}
function sedAuthe(){
	uni.navigateTo({
		url:'/pages/user/sedAuthe/sedAuthe'
	})
}

 getUserInfo()
</script>

<style lang="scss" scoped>
.userbox{
	.userinfo{
		padding: 30rpx 30rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		// background-color: lawngreen;
		
		image{
			width: 200rpx;
			height: 200rpx;
			border-radius: 50%;
		}
		.text1{
			font-size:40rpx;
			color: #000;
			font-weight: 700;
			padding: 20rpx 10rpx;
		}
		.text2{
			font-size:30rpx ;
			color: rgba(0, 0, 0, 0.7) ;
		}
	}
	
	.setion{
		margin:50rpx 30rpx;
		// background-color: #000;
		border: 1rpx solid rgba(0, 0, 0, 0.3);
		border-radius: 30rpx;
		overflow: hidden;
		// border-collapse: collapse;
		box-shadow: 0  7rpx 10rpx rgba(0, 0, 0, 0.2);
		.list{
			display: flex;
			justify-content: space-between;
			height: 120rpx;
			padding: 5rpx;
			background: rgba(255, 255, 255, 1);
            border-bottom: 1rpx solid rgba(0, 0, 0, 0.3) ;
            .list_item{
				display: flex;
				justify-content: center;
				align-items: center;
				.list_item:last-child{
					border-bottom:0;
				}
			}
		}
	}
	.texts{
		// border: 1px solid black;
		// width: 600rpx;
		margin: 0rpx 30rpx;
		padding: 0rpx 40rpx;
		text-align: center;
		// background-color: wheat;
	}
}
</style>
